<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
	</body>
	<script type="text/javascript">
	 
	 
	   function ajax(options){
	   	  //存储的是默认值 
	   	  var defaults={
	   	  	type:'get',
	   	  	url:'',
	   	  	data:{},
	   	  	header:{
	   	  		'Content-type':'application/x-www-form-urlencoded'
	   	  	},
	   	  	success:function(){
	   	  		
	   	  	},
	   	  	error:function(){
	   	  		
	   	  	}
	   	  	
	   	  }
	   	 
	   	 Object.assign(defaults,options)
	   	 
	   	  //创建ajax对象
	   	  var xhr=new XMLHttpRequest()
	   	  
	   	  var params=""
	   	  //循环用户传递进来的对象格式参数
	   	  for(var attr in defaults.data){
	   	  	//将参数转换为字符串格式
	   	  	params+=attr+'='+defaults.data[attr]+'&'
	   	  }
	   	  //将参数最后面的&符截取掉
	   	  params=params.substr(0,params.length-1)
	   	  
	   	  //判断请求方式
	   	  if(defaults.type=='get'){
             defaults.url=defaults.url+'?'+params	   	  	
	   	  }
	   	  
	   	  
	   	  //配置ajax对象
	   	  xhr.open(defaults.type,defaults.url)
	   	   //监听xhr对象下面的onload事件
	   	  //当xhr对象接收完响应数据后触发
	   	  xhr.onload=function(){
	   	  	 console.log(xhr.responseText)
	   	  	 defaults.success(xhr.responseText)
	   	  }
	   	  
	   	  
	   	  if(defaults.type=='post'){
	   	  	//用户希望的向服务器端传递的参数的类型
	   	  	var contentType=defaults.header['Content-Type']
	   	  	
	   	  	//设置请求参数的类型
	   	  	xhr.setRequestHeader('Content-Type',defaults.header['Content-Type'])
	   	  	//判断用户希望的请求参数类型
	   	  	if(contentType=='application/json'){
	   	  	     xhr.send(JSON.stringify(defaults.data))
	   	  	}else{
	   	  		xhr.send(params)
	   	  	}
	   	  }else{
	   	  	 //发送请求
	   	  xhr.send()
	   	  }
	   	  
	   	   //监听xhr对象下面的onload事件
	   	  //当xhr对象接收完响应数据后触发，只能说明请求完成了，不能说明返回的状态码就是成功的
	   	  xhr.onload=function(){
	   	  	//获取响应头中的数据
			//xhr.getResponseHeader()
	   	  	var contentType = xhr.getResponseHeader('Content-Type')
	   	  	var responseText = xhr.responseText
	   	  	//如果响应类型中包含'application/json'，则为调用者把json字符串转换为json对象
	   	  	if(contentType.includes('application/json')){
	   	  		responseText = JSON.parse(responseText)
	   	  	}
	   	  	
	   	  	if(xhr.status==200){
	   	  		options.success(responseText,xhr)
	   	  		//console.log(xhr.responseText)
	   	  	}else{
	   	  		options.error(responseText,xhr)
	   	  	}
	   	  }
	   	  
	   }
	 
	 
	 
	 //某些参数不传递使用默认值
	 ajax({
	 	//请求方式
	 	type:'post',
	 	url:'http://192.168.0.101:10004/first', 
	 	data:{
	 		name:"zhangsan",
	 		age:20
	 	},
	 	header:{
	 		'Content-Type':'application/json'
	 	},
	 	success:function(data){
	 		console.log(data)
	 	},
	 	error:function(){
	 		
	 	}
	 	
	 })
	 
	 
 	</script>
</html>
